<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no,viewport-fit=cover"/>
    <title>百草游戏平台</title>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <link href="mob/css/logo_search.css" rel="stylesheet" media="screen">
    <link href="mob/css/common.css" rel="stylesheet" media="screen">
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.0/css/swiper.min.css">
    <!-- js -->
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
            crossorigin="anonymous"></script>
    <script src="mob/js/common.js"></script>
</head>
<body>
<div id="logo_search">
    <!--logo，搜索顶部导航-->
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="logo-search">
            <a href="index.html"><img src="img/comp/logo.jpg" alt="logo" class="logo"></a>
            <div class="search">
                <input type="search" class="search-input">
                <i class="fa fa-search" @click="logo_search()"></i>
            </div>
        </div>
    </nav>
    <!--表清单-->
    <div v-if="showList" class="game-list">
        <div class="box-flex" v-for="game in gameList">
            <div class="img-flex">
                <img :src="game.gameIcon">
            </div>
            <div class="title-flex">
                <h5>{{game.gameName}}</h5>
                <i class="fa fa-star" style="color: orange;"></i>
                <i class="fa fa-star" style="color: orange;"></i>
                <i class="fa fa-star" style="color: orange;"></i>
                <i class="fa fa-star" style="color: orange;"></i>
                <i class="fa fa-star" style="color: orange;"></i>
                <span>{{game.gamePlay}}人在玩</span>
                <div class="hui">{{game.gameProfile}}</div>
            </div>
            <a :href="'game_detail.html?gameId='+game.gameId+''" class="start-game">
                <img src="img/comp/开始1.png" alt="">
            </a>
        </div>
    </div>
    <div class="no-search" v-if="!showList">
        <h2>没有找到匹配数据</h2>
    </div>
    <!--底部导航-->
    <nav class="navbar navbar-default navbar-fixed-bottom">
        <div class="container">
            <a href="index.html" class="footer-item">
                <i class="fa fa-gamepad active"></i>
                <h6 class="active">游戏库</h6>
            </a>
            <a href="category.html" class="footer-item">
                <i class="fa fa-list"></i>
                <h6>分类</h6>
            </a>
            <a href="shop.html" class="footer-item">
                <i class="fa fa-shopping-cart"></i>
                <h6>积分商城</h6>
            </a>
            <a href="mine.html" class="footer-item">
                <i class="fa fa-diamond"></i>
                <h6>我的</h6>
            </a>
        </div>
    </nav>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.0/js/swiper.min.js"></script>
<script src="mob/js/logo_search.js"></script>
</body>
</html>
